<html>

<head>
    <title>MQTT JS Example</title>

    <script src="https://cdn.jsdelivr.net/npm/mqtt@4.0.1/dist/mqtt.min.js" type="text/javascript"></script>

    <script type="text/javascript">
        var client = mqtt.connect('ws://localhost:80/mqtt')

        client.on('connect', function () {
            client.subscribe('mqtt_subscription', function (err) {
                console.log("Subscribed");
            })
        })

        client.on('message', function (topic, message) {
            console.log(topic);
            console.log(message.toString())
        })

        function buttonClick() {
            client.publish("MQTT_JS_TOPIC", "payload");
        }
    </script>

</head>

<body>
    <button onclick="buttonClick()">Publish</button>
</body>

</html>